<script lang="ts" setup>
import { ref, reactive } from "vue";
import managerServiceApi from "@/api/modules/org/bean/manager";
import { SYSTEM_CONFIG } from "@/config/system";
const emit = defineEmits<{
  (e: "ok", val: any[]): void;
}>();

const props = defineProps({
  userDeptId: {
    type: String,
    default: ""
  }
});

const DeptRoleListTableRef = ref();
const DeptRoleTableState = reactive({
  /**查询参数 */
  queryparam: {
    appId: SYSTEM_CONFIG.APP_ID,
    userDeptId: props.userDeptId,
    filterQuery: true
  },
  selectionPkList: [] as string[],

  /**
   * 表格的列配置
   */
  tableColumn: [
    { prop: "roleName", label: "角色名称", align: "center" },
    { prop: "roleDescription", label: "角色描述", align: "center" }
  ],
  /**
   * 表格数据加载的方法
   */
  loadData: (params: any) =>
    managerServiceApi.fetchDeptRoleList(null, {
      ...params,
      ...DeptRoleTableState.queryparam
    })
});

defineExpose({
  getDeptRoleListTableRef: () => DeptRoleListTableRef.value
});
</script>
<template>
  <JxtechBaseTable
    ref="DeptRoleListTableRef"
    row-key="roleId"
    :table-column="DeptRoleTableState.tableColumn"
    :load-data="DeptRoleTableState.loadData"
    :pagination-show="false"
    :download-show="false"
  ></JxtechBaseTable>
</template>
<style>
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
  background-color: var(--el-checkbox-checked-bg-color);
  border-color: var(--el-checkbox-checked-input-border-color);
}
</style>
